Conversation
| @@ -0,0 +1,125 @@ | |||
| body { | |||
| background-color: rgba(121, 105, 228, 0.446); | |||
| display: grid; | |||
There was a problem hiding this comment.
질문에 대한 답은 signup에만 display grid속성이 들어가서 그런것 같습니다.
There was a problem hiding this comment.
signup에 있는 signin-link의 부모 요소는 relative를 가진 link-container라고 생각했는데 body가 grid인 것과 연관이 있는 건가요?
There was a problem hiding this comment.
'signup에 있는 signin-link의 부모 요소는 relative를 가진 link-container라고 생각했는데' 이부분은 정확합니다. 하지만 body와 link-container가 연관이 있기 때문에 그 아래의 link들의 위치가 달라진것 같습니다.
link-container가 signup페이지의 경우 가운데에 있고 signin페이지의 경우 왼쪽정렬이 되어있기 때문에 두가지 요소의 위치가 달라진것입니다.
There was a problem hiding this comment.
앗 link-container가 왼쪽 정렬 되어있어서 그랬군요..! 감사합니다 ㅠㅠ
| position: absolute; | ||
| right: 1%; | ||
| top: 5%; | ||
| font-size: small; |
There was a problem hiding this comment.
이런식으로 주는 것보다는 link-container의 display속성을 flex로 주고 flex-direction: row-reverse;속성을 통해 방향을 반대로 바꾸면 좀 더 쉬울것 같아요 이때 주의할 점은 link-container의 width는 100%여야 원하는 모양이 나오거에요. 너무 오른쪽으로 붙었다면 link-container의 오른쪽 패딩을 줘도 괜찮고 link-container에 margin-right를 주어도 괜찮을듯 합니다.
There was a problem hiding this comment.
오,, flex-direction: row-reverse; 속성을 주는 게 더 괜찮아 보이네요! 감사합니당
2 participants
로그인 페이지는 flex를 사용했고 회원가입 페이지는 grid를 사용해봤습니다.
로그인 페이지
회원가입 페이지
궁금한 부분